import React, { useState, useEffect } from 'react';
import { StyleSheet, View} from 'react-native';
import { scaleSizeH, scaleSizeW, setSpText } from '../../util/ScreenUtil.js';
import Icon from "../../assets/fonts/iconfont";
import HotMovie from './Hotmovies';
import FilmsMovie from './filmsMoive'
import Seach from './Seach';
import { createAppContainer } from 'react-navigation'
import { createMaterialTopTabNavigator } from 'react-navigation-tabs'
const TabNav = createAppContainer(createMaterialTopTabNavigator(
    {
        HotMovie,FilmsMovie
    },
    {
        tabBarOptions: {
            tabStyle: {
                elevation: 0,
                color: "black",
                padding: 0,
                margin: 0
            },
            activeTintColor: "red",

            inactiveTintColor: "#ccc",
            indicatorStyle: {
                backgroundColor: "red"
            },
            style: {
                elevation: 0,
                height: 40,
                backgroundColor: "white"
            }
        }
    }
))
export default function Movie(props) {

    return (
        <View style={styles.container}>
            <Seach></Seach>
            <TabNav screenProps={props.navigation}></TabNav>
        </View>
    );
}
const styles = StyleSheet.create({
    container: {
        flex: 1,
    },
    img: {
        width: scaleSizeW(750),
        height: scaleSizeH(1500)
    }
});
Movie.navigationOptions = () => {
    return {
        title: "热映",
        tabBarIcon: ({ focused }) => {
            if (focused) {
                return <Icon name="goupiao" size={20} color="green" />;
            }
            return <Icon name="goupiao" size={20} color="black" />;
        }
    };
};